Font Awesomeを常時使えるようにするUserCSS
ページ内だろうと関係なしにFont Awesomeを使えるようになる。
こんな感じ:
一部の文字は文字の太さ(font-weight)を変更しないと正しく表示されない。
ソース
デフォルトのfont-familyに"Font Awesome 6 Free","Font Awesome 5 Brands"を追加しただけ。
Kamon iconsも使えるようにした。
参考:/villagepump/Font Awesomeを常時使えるようにするUserCSS#61ff96091280f0000065c779
ただし、文字コードが被っていた場合、Font Awesomeの方が優先される
code:style.css
@import "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css";
/* Font Awesomeを常時使えるようにするCSS */
body {
--base-fonts: "Roboto",Helvetica,Arial,"Hiragino Sans","Font Awesome 6 Free","Font Awesome 6 Brands","AppIcons",sans-serif;
}
div.editor,
.grid li,
.stream {
font-family: var(--base-fonts);
}
変更履歴
2023/01/21 Streamで有効になっていなかった問題を修正
2023/01/14 Font Awesome 6.2.1のアイコンを使用できるようにした。
2023/02/01 BrandsアイコンもFont Awesome 6を使うように修正
#Font_Awesome #UserCSS